<template>
    <div>
        <div class="title">周末去哪了</div>
        <div class="box" v-for="(item,index) in imgUrl" :key="item.id">
            <div class="list">
                <img :src="item.url" alt="">
                <p class="t1">{{item.address}}</p>
                <p class="t2">{{item.txt}}</p>
            </div>
        </div>
    </div>
</template>
<script>
    export default{
        data(){
            return{
        imgUrl:[
            {id:'00',address:'京城周末撒欢',txt:'在帝都过周末，不仅仅是城中游！',url:'http://img1.qunarzz.com/sight/source/1811/f3/86173f863bef61.jpg_r_640x214_52b003ac.jpg'},
            {id:'01',address:'京城有好泉',txt:'细数北京温泉，温暖你的冬天',url:'http://img1.qunarzz.com/sight/source/1510/6e/1ea71e2f04e.jpg_r_640x214_aa6f091d.jpg'},
            {id:'02',address:'京城溜娃必去',txt:'德智体美劳全面发展的亲子日，这些地方该去看看…',url:'http://img1.qunarzz.com/sight/source/1811/7e/476589267ebb41.jpg_r_640x214_bf599709.jpg'},
            {id:'03',address:'帝都必打卡',txt:'来北京必去的景点非这些地方莫属',url:'http://img1.qunarzz.com/sight/source/1505/aa/7baaf8a851d221.jpg_r_640x214_1431200f.jpg'},
            {id:'04',address:'登高望远秋色佳',txt:'山顶满眼彩色，此情此景醉了',url:'http://img1.qunarzz.com/sight/source/1509/81/0412da9c4db66a.jpg_r_640x214_8e23871e.jpg'}
        ]
            }
        }
    }
</script>
<style lang="stylus" scoped>
.title{
    width 100%
    height 50px
    line-height 50px
    text-align left 
    text-indent .3rem
    background-color #ccc
}
.box .list{
    width 100%
    height 250px
    border-bottom 20px solid #F3F3F3
}
.box .list p{
    text-align left 
    text-indent .2rem
    margin: 5px 5px; 
}
.box .list .t1{
    font-size 14px
}
.box .list .t2{
    font-size 12px
}
.box .list img{
    width 100%
}
</style>